import React from 'react'
import { Table,Tabs,message,Button,Modal,Form,Input,Space} from 'antd';
import {reqAdmincheckOut,reqAdminoutVerify,reqAdminChuRefuse} from '../../api/index'
import './index.css'
class System extends React.Component{
    constructor(props){
        super(props)
        this.state ={
            data1:[],
            outId:null,
            processingResults:null,
            // inputValue1:'',
            // inputValue2:'',
            visible1:false,
            visible2:false
        }
    this.callback = this.callback.bind(this)
    this.handleCancel = this.handleCancel.bind(this)
    this.handleclick = this.handleclick.bind(this)
    this.handleClick = this.handleClick.bind(this)
    this.handleRefuse = this.handleRefuse.bind(this)
    }
    handleRefuse(params){
      reqAdminChuRefuse(params).then(res=>{
        console.log(res)
        if(res.code === 0){
          this.setState({data1:[]})
          reqAdmincheckOut().then(res=>{
            console.log(res.data)
            res.data.map((item,index)=>{
              const outId = item.outId;
              const agentName = item.agentName;
              const agentPhone = item.agentPhone;
              const chargeName = item.chargeName;
              const outTime = item.outTime;
              const deliveryAddress = item.deliveryAddress;
              item.outOfStockInfoList.map((item,index)=>{
                const tempValue = {
                  deliveryAddress:deliveryAddress,
                  outId:outId,
                  agentName:agentName,
                  agentPhone:agentPhone,
                  chargeName:chargeName,
                  outTime:outTime,
                  goodsName:item.goodsName,
                  goodsNum:item.goodsNum,
                  goodsWeight:item.goodsWeight
                }
                console.log(tempValue)
                this.setState({data1:[...this.state.data1,tempValue]})
              })
            })
          })
          setTimeout(()=>{
            message.success('拒绝出库申请成功！')
          },500)
        }
      })
    }
    handleClick(){//发送拿到id的审核通过，并且删除此条待审批的列表。发送请求
      console.log("审批通过")
      const outId = {
        outId:this.state.outId,
      }
      reqAdminoutVerify(outId).then(res=>{
        console.log(res)
        if(res.code == 0){
          this.setState({visible1:false})
          message.success("出库审核成功！")
          this.setState({data1:[]})
          reqAdmincheckOut().then(res=>{
            console.log(res.data)
            res.data.map((item,index)=>{
              const outId = item.outId;
              const agentName = item.agentName;
              const agentPhone = item.agentPhone;
              const chargeName = item.chargeName;
              const outTime = item.outTime;
              const deliveryAddress = item.deliveryAddress;
              item.outOfStockInfoList.map((item,index)=>{
                const tempValue = {
                  deliveryAddress:deliveryAddress,
                  outId:outId,
                  agentName:agentName,
                  agentPhone:agentPhone,
                  chargeName:chargeName,
                  outTime:outTime,
                  goodsName:item.goodsName,
                  goodsNum:item.goodsNum,
                  goodsWeight:item.goodsWeight
                }
                console.log(tempValue)
                this.setState({data1:[...this.state.data1,tempValue]})
              })
            })
          })
        }
      })
    }
    handleCancel(){
      console.log('Clicked cancel button');
      this.setState({visible1:false});
      this.setState({visible2:false});
    };
    componentDidMount(){
      reqAdmincheckOut().then(res=>{
        console.log(res.data)
        res.data.map((item,index)=>{
          const outId = item.outId;
          const agentName = item.agentName;
          const agentPhone = item.agentPhone;
          const chargeName = item.chargeName;
          const outTime = item.outTime;
          const deliveryAddress = item.deliveryAddress;
          item.outOfStockInfoList.map((item,index)=>{
            const tempValue = {
              deliveryAddress:deliveryAddress,
              outId:outId,
              agentName:agentName,
              agentPhone:agentPhone,
              chargeName:chargeName,
              outTime:outTime,
              goodsName:item.goodsName,
              goodsNum:item.goodsNum,
              goodsWeight:item.goodsWeight
            }
            console.log(tempValue)
            this.setState({data1:[...this.state.data1,tempValue]})
          })
        })
      })
    }
    callback(key) {
      console.log(key);
    }
    changeTypes(e){
        switch (e) {
            case 0:
                return '未处理';
            case 1:
                return '进行中';
            case 2:
                return '已完成';
            case 3:
                return '处理失败';
        }
    }
    
    handleclick(e){//填入审批数据之后 拿到的id
      console.log(e)
      this.setState({outId:e.outId})
      console.log(e.outId)
      this.setState({visible1:true});
    }
    render(){
        const columns1 = [
            {
              title: '出库ID',
              dataIndex: 'outId',
              key: 'outId',
              render: text => <a>{text}</a>,
            },
            {
              title: '经办人姓名',
              dataIndex: 'agentName',
              key: 'agentName',
            },
            {
              title: '经办人电话',
              dataIndex: 'agentPhone',
              key: 'agentPhone',
            },
            {
              title: '负责人姓名',
              dataIndex: 'chargeName',
              key: 'chargeName',
            },
            {
              title: '申请时间',
              dataIndex: 'outTime',
              key: 'outTime',
            },
            {
              title: '物品名称',
              dataIndex: 'goodsName',
              key: 'goodsName',
            },
            {
              title: '物品数量',
              dataIndex: 'goodsNum',
              key: 'goodsNum',
            },
            {
              title: '物品规格(L/kg)',
              dataIndex: 'goodsWeight',
              key: 'goodsWeight',
            },
            {
              title: '出库去向',
              dataIndex: 'deliveryAddress',
              key: 'deliveryAddress',
            },
            {
              title: '审批操作',
              key: 'action',
              render: (text, record) => (
                <Space size="middle">
                  <Button onClick={()=>{
                      const params = {
                        outId:record.outId,
                      }
                      this.handleclick(params)
                  }} type='primary'>通过</Button>
                  <Button onClick={()=>{
                      const params = {
                        outId:record.outId,
                    }
                    this.handleRefuse(params)
                }} type='primary' danger>拒绝</Button>
                </Space>
              ),
            },
          ];
         
          const data1 = this.state.data1;
          const layout = {
            labelCol: {
              span: 8,
            },
            wrapperCol: {
              span: 16,
            },
          };
        return(<div>
              <Table className="tableOne" columns={columns1} dataSource={data1} />
              <Modal
              title="出库审核"
              visible={this.state.visible1}
              onCancel={this.handleCancel}
              footer=''
            >
              <div className="needTitle">
                确定让该物品出库吗？
              </div>
                  <Button className="buttonStye" onClick={this.handleClick} type='primary'>确认</Button>  
            </Modal>
        </div>)
    }
}
export default System